<!-- 蓝色登录页面2 -->
<template>
  <view class="container bgc_force">
    <view class="header">
      <view class="title">
        您好，
        <br/>
        欢迎来到授权登录页
      </view>
    </view>
    <view class="login-view">
      <view class="t-login">
        <view class="form_class">
          <view class="desc">
            授权信息仅用于测试小程序登录头像和昵称仅用于测试数功能展示
          </view>
          <view class="mt-40">
            <view class="login_class" @tap="authLogin()">授权登录</view>
            <view class="register_class" @tap="back()">暂不登录</view>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>
<script>
import {InfoUtils, UniRouter} from "@/util/uniUtils";

export default {
  name: 'authLogin',
  data() {
    return {};
  },
  onLoad() {
  },
  methods: {
    async authLogin() {
      try {
        // await this.$refs.uForm.validate()
        console.log("验证通过", this.form)
        UniRouter.navigateTo('/pages/index/index')
      } catch (e) {
        if (e && e.length > 0) {
          let {message} = e[0]
          InfoUtils.showInfo(message)
        }
        console.log(e)
      }
    },
    //注册按钮点击
    back() {
      uni.navigateBack()
    },
  }
};
</script>
<style lang="scss" scoped>
.header {
  width: 100%;
  height: 450rpx;
  background-image: linear-gradient(to right, $main-color, $main-color-2);

  .title {
    text-align: left;
    font-size: 42rpx;
    color: #ffffff;
    padding: 130rpx 0 0 70rpx;
    font-weight: bold;
    line-height: 70rpx;
  }
}


.login-view {
  width: 100%;
  position: relative;
  margin-top: -60rpx;
  background-color: $uni-bg-color;
  border-radius: 8% 8% 0 0;

  .t-login {
    width: 600rpx;
    margin: 0 auto;
    font-size: 28rpx;
    padding-top: 80rpx;

    .form_class {
      zoom: 1;

      &:after {
        clear: both;
        display: block;
        visibility: hidden;
        height: 0;
        content: '\20';
      }

      .desc {
        color: $uni-text-color-grey;
        text-align: center;
        margin-bottom: 100rpx;
      }

    }

    .login_class {
      font-size: 28rpx;
      background-image: linear-gradient(to left, $main-color, $main-color-2);
      color: #fff;
      height: 90rpx;
      line-height: 90rpx;
      border-radius: 50rpx;
      font-weight: bold;
      text-align: center;
    }

    .register_class {
      font-size: 28rpx;
      color: $uni-text-color;
      height: 90rpx;
      line-height: 90rpx;
      border-radius: 50rpx;
      font-weight: bold;
      background: $uni-bg-color-grey;
      text-align: center;
      margin-top: 30rpx;
    }
  }
}


.mt-40 {
  margin-top: 40rpx;
}



</style>
